<template>
    <div class="box">
        <!-- 图标 -->
        <div class="imgDiv"> 
            <img src="../../assets/images/group/成功.png" alt="">
            <p>核销成功</p>
        </div>
        
        <!-- 文字描述 -->
       <div class="menu">
            <ul>
                <li class="li">
                    <span>商品名称</span>
                    <span>{{name}}</span>
                </li>
                <li class="li">
                    <span>核销数量</span>
                    <span>{{num}}份</span>
                </li>
                <li class="li">
                    <span>核销金额</span>
                    <span>${{totalPrice}}</span>
                </li>
            </ul>
       </div>

       <div class="btnDiv">
            <van-button round type="info" class="btn" @click="toAllActivity">完成</van-button>
       </div>

    </div>
</template>
<script>
    export default{
        data(){
            return{
                name:'巴西烤肉两人套餐',
                num:1,
                totalPrice:667.06
            }
        },
        methods:{
            toAllActivity(){
                this.$router.push('./GroupBuy')
            }
        }

    }
</script>
<style scoped>
    .box{
      width: 100%;
    }
    .imgDiv{
        width: 100%;
        height: 300px;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }
    img{
        width: 100px;
        height: 100px;
       
    }
    .li{
        width: 80%;
        margin: 0 auto;
        height: 50px;
        line-height: 50px;
        display: flex;
        justify-content: space-between;
        align-items: center;
        font-size: 16px;
    }
    .menu{
        border-top: 1px dashed grey;
        border-bottom: 1px dashed grey;
    }
    .btn{
        width: 70%;
        margin: 0 auto;
        border: 1px solid #ff6f54;
        background: white;
        color: #ff6f54;
    }
    .btnDiv{
        width: 100%;
        text-align: center;
        margin-top: 80px;
    }

</style>